import React, { Component } from 'react'

import store from '../../redux/store'
// 引入actionCreator ，专门用于创建action对象
import {createJiaAction, createJianAction} from '../../redux/count_action'

export default class Count extends Component {
    state={
        carName:'s'
    }

    // 页面加载完 监听store的变化，如果变化重新渲染页面
    // componentDidMount(){
    //     store.subscribe(()=>{
    //         this.setState({})
    //     })
    // }

    jia = () =>{
        let {value} = this.selectnumber
        store.dispatch(createJiaAction(value*1))

    }
    jian = () =>{
        let {value} = this.selectnumber
        store.dispatch(createJianAction(value*1))
    }
    jia_odd = () =>{
        let {value} = this.selectnumber
        let count = store.getState()
        if(count%2 == 0){
            store.dispatch(createJiaAction(value*1))
        }
    }
    jia_sync = () =>{
        let {value} = this.selectnumber
       
        setTimeout(()=>{
            store.dispatch(createJiaAction(value*1)) 
        },500)
            
    }

    render() {
        return (
            <div>
                <h1>当前求和是:{store.getState()}</h1>
                <select ref={c => this.selectnumber = c}>
                    <option value="1">1</option>
                    <option value="2">2</option>
                    <option value="3">3</option>
                </select>
                &nbsp;
                <button  onClick={this.jia}>加</button>&nbsp;
                <button onClick={this.jian}>减</button>&nbsp;
                <button onClick={this.jia_odd}>当前结果是偶数再加</button>&nbsp;
                <button onClick={this.jia_sync}>异步加</button>&nbsp;
            </div>
        )
    }
}
